<template>
    <!-- 数据中心/财务数据中心/临时收支记账 -->
    <div class="temporaryRecord">
        <div class="top_operation">

            <div class="every_operation" v-if="isRegionShow">
                <span><b style="color:red;">*</b> 大区：</span>
                <a-select
                    show-search
                    :filter-option="filterOption"
                    style="width: 195px" 
                    @change="regionChange" 
                    v-model="regionId"
                    placeholder="请选择大区"
                >
                    <a-select-option :key="index" v-for="(item, index) in regionList" :value="item.id">
                        {{item.name}}
                    </a-select-option>
                </a-select>
            </div>
            <div class="every_operation" v-if="isCityShow">
                <span><b style="color:red;">*</b> 城市：</span>
                <a-select 
                    show-search
                    :filter-option="filterOption"
                    style="width: 195px" 
                    @change="cityChange" 
                    v-model="cityId"
                    placeholder="请选择城市"
                >
                    <a-select-option :key="index" v-for="(item, index) in cityList" :value="item.id">
                        {{item.name}}
                    </a-select-option>
                </a-select>
            </div>
            <div class="every_operation" v-if="isWareShow">
                <span><b style="color:red;">*</b> 仓库：</span>
                <a-select
                    show-search
                    :filter-option="filterOption" 
                    style="width: 195px" 
                    @change="warehouseChange" 
                    v-model="organizeId"
                    placeholder="请选择仓库"
                >
                    <a-select-option :key="index" v-for="(item, index) in warehouseList" :value="item.id">
                        {{item.name}}
                    </a-select-option>
                </a-select>
            </div>
            
            <div class="every_operation">
                <span>客户：</span>
                <a-select style="width: 195px"
                    show-search
                    :filter-option="filterOption"
                    @change="customerChange" 
                    v-model="customerCode" 
                    allowClear
                    placeholder="请选择客户"
                >
                    <a-select-option :key="index" v-for="(item, index) in customerList" :value="item.customerCode">
                        {{item.customerName}}
                    </a-select-option>
                </a-select>
            </div>
            <div class="every_operation" v-show="isOpen">
                <span>货主：</span>
                <a-select style="width: 195px" 
                    show-search
                    :filter-option="filterOption"
                    @change="handleChange" 
                    v-model="ownerCode"
                    allowClear
                    placeholder="请选择货主"
                >
                    <a-select-option :key="index" v-for="(item, index) in ownerList" :value="item.ownerCode">
                        {{item.ownerName}}
                    </a-select-option>
                </a-select>
            </div>

            <div class="every_operation" v-show="isOpen">
                <span>创建时间：</span>
                <a-range-picker
                    v-model="createTime"
                    :show-time="{ format: 'HH:mm:ss' }"
                    format="YYYY-MM-DD HH:mm:ss"
                    :placeholder="['Start Time', 'End Time']"
                    @change="createChange"
                    @ok="createOk"
                    style="width:195px;"
                />
            </div>
            <div class="every_operation" v-show="isOpen">
                <span>创建人：</span>
                <a-input placeholder="请输入创建人" v-model="createBy" style="width:195px;" allowClear/>
            </div>
            <div class="every_operation" v-show="isOpen">
                <span>修改时间：</span>
                <a-range-picker
                    v-model="updateTime"
                    :show-time="{ format: 'HH:mm:ss' }"
                    format="YYYY-MM-DD HH:mm:ss"
                    :placeholder="['Start Time', 'End Time']"
                    @change="editChange"
                    @ok="editOk"
                    style="width:195px;"
                />
            </div>
            <div class="every_operation" v-show="isOpen">
                <span>修改人：</span>
                <a-input placeholder="请输入修改人" v-model="updateBy" style="width:195px;" allowClear/>
            </div>
            <div class="every_operation" v-show="isOpen">
                <span>收支类型：</span>
                <a-select style="width: 195px" @change="handleTypeChange" v-model="tempType" allowClear  placeholder="请选择收支类型" >
                    <a-select-option value="income">
                    收入
                    </a-select-option>
                    <a-select-option value="pay">
                    支出
                    </a-select-option>
                </a-select>
            </div>

            <div class="every_operation" v-show="isOpen">
                <span>明细分类：</span>
                <a-select style="width: 195px" @change="handleIficationChange" v-model="detailedType" allowClear  placeholder="请选择收支类型" >
                    <a-select-option value="operation">
                    运作类
                    </a-select-option>
                    <a-select-option value="fixed">
                    固定类
                    </a-select-option>
                    <a-select-option value="temp">
                    临时类
                    </a-select-option>
                </a-select>
            </div>

            <div class="every_operation" v-show="isOpen">
                <span>收支项名称：</span>
                    <!-- <a-input style="width:195px" v-model="financeName" allowClear   placeholder="请输入收支项名称"> -->
                    <!-- </a-input> -->
                    <a-select
                    style="min-width:195px"
                    mode="multiple"
                    placeholder="请输入收支项名称"
                    @change="fincenameChange"
                    v-model="financeName"
                >
                    <a-select-option v-for="i in REList" :key="i.id" :value="i.id">
                        {{ i.financeName}}
                    </a-select-option>
                </a-select>
            </div>

            <div class="every_operation" v-show="isOpen">
                <span>记账归属：</span>
                <a-month-picker style="width:195px;" v-model="collection" placeholder="请选择记账归属" @change="onKeepChange" />
            </div>
            
            <div class="button_div">
                <a-button type="primary" icon="search" @click="onSearch()">搜索</a-button>
                <a-button type="primary" icon="sync" style="margin-left:20px;" @click="onReset()">重置</a-button>
                <!-- <a-button @click="isOpen = !isOpen" type="link">{{isOpen?'收起':'展开'}}<a-icon :type="isOpen?'up':'down'" /></a-button> -->
                <!-- <a-button type="link">收起<a-icon type="up" /></a-button> -->
            </div>
        </div>
        
        <div class="add_btn">
            <a-button type="primary"  @click="showDrawer">新增</a-button>
            <a-button style="margin-left:20px;" @click="batchDelete()">删除</a-button>
            <a-button  @click="doImport()"  style="margin-left:20px">导入</a-button>
            <a-button  @click="doExport()"  style="margin-left:20px">导出</a-button>
            <a-button  @click="dowmloadTempalte()"  style="margin-left:20px">下载模板</a-button>
            <!-- 右滑抽屉 -->
            <a-drawer
                :title="drawerTitle"
                :placement="placement"
                :closable="false"
                :visible="visible"
                @close="onClose"
                width="1000"
            >
                <a-form-model
                    ref="ruleForm"
                    :model="form"
                    :rules="rules"
                    :label-col="labelCol"
                    :wrapper-col="wrapperCol"
                    labelAlign="right"
                    layout="inline"

                >
                    <!-- <a-form-model-item label="大区" prop="region" style="width:46%;height:60px;float:left;margin-bottom:0;">
                        <a-select
                            show-search
                            :filter-option="filterOption" 
                            style="width: 100%;" 
                            @change="formRegionChange" 
                            v-model="form.region"
                            placeholder="请选择大区"
                        >
                            <a-select-option  :key="index" v-for="(item, index) in regionList" :value="item.id">
                                {{item.name}}
                            </a-select-option>
                        </a-select>
                    </a-form-model-item>
                    <a-form-model-item label="城市" prop="city" style="width:46%;height:60px;float:left;margin-bottom:0;">
                        <a-select
                            show-search
                            :filter-option="filterOption" 
                            style="width: 100%;" 
                            @change="formCityChange" 
                            v-model="form.city"
                            placeholder="请选择城市"

                        >
                            <a-select-option :key="index" v-for="(item, index) in cityList" :value="item.id">
                                {{item.name}}
                            </a-select-option>
                        </a-select>
                    </a-form-model-item> -->
                    <!-- <a-form-model-item label="仓库" prop="name" style="width:46%;height:60px;float:left;margin-bottom:0;">
                        <a-select
                            show-search
                            :filter-option="filterOption" 
                            style="width: 100%;" 
                            @change="formWarehouseChange" 
                            v-model="form.name"
                            placeholder="请选择仓库"
                        >
                            <a-select-option :key="index" v-for="(item, index) in warehouseList" :value="item.id">
                                {{item.name}}
                            </a-select-option>
                        </a-select>
                    </a-form-model-item> -->

                    <a-form-model-item label="客户" prop="customerCode" style="width:46%;height:60px;float:left;margin-bottom:0;">
                        <a-select
                            show-search
                            :filter-option="filterOption" 
                            style="width: 100%;" 
                            @change="formCustomerChange" 
                            v-model="form.customerCode"
                            placeholder="请选择客户"
                        >
                            <a-select-option :key="index" v-for="(item, index) in customerList" :value="item.customerCode">
                                {{item.customerName}}
                            </a-select-option>
                        </a-select>
                    </a-form-model-item>

                    <a-form-model-item label="货主" prop="ownerCode" style="width:46%;height:60px;float:left;margin-bottom:0;">
                        <a-select
                            show-search
                            :filter-option="filterOption" 
                            style="width: 100%;" 
                            @change="formOwnerChange" 
                            v-model="form.ownerCode"
                            allowClear
                            placeholder="请选择货主"
                        >
                            <a-select-option :key="index" v-for="(item, index) in form.ownerlist" :value="item.ownerCode">
                                {{item.ownerName}}
                            </a-select-option>
                        </a-select>
                    </a-form-model-item>

                    <!-- <a-form-model-item ref="categoryId" label="收支项名称" prop="financeName" style="width:46%;height:60px;float:left;margin-bottom:0;">
                        <a-input type="text" style="width:100%" v-model="form.financeName" :maxLength="128" placeholder="请输入收支项名称">
                        </a-input>
                    </a-form-model-item> -->

                    <a-form-model-item ref="cascaderValue" label="收支项名称" prop="cascaderValue" style="width:46%;height:60px;float:left;margin-bottom:0;">
                            <!-- :load-data="loadData"  -->
                        <a-cascader 
                            style="width:100%;" 
                            v-model="form.cascaderValue"  
                            :options="options" 
                            @change="changeCascaderValue"
                            placeholder="请选择收支项名称" />
                    </a-form-model-item>

                    <!-- <a-form-model-item label="收支类型" prop="tempType" style="width:46%;height:60px;float:left;margin-bottom:0;">
                        <a-select v-model="form.tempType" placeholder="请选择收支类型" style="width:100%"   >
                            <a-select-option value="收入">
                            收入
                            </a-select-option>
                            <a-select-option value="支出">
                            支出
                            </a-select-option>
                        </a-select>
                    </a-form-model-item> -->
                    <a-form-model-item ref="amount" label="金额" prop="amount" style="width:46%;height:60px;float:left;margin-bottom:0;">
                        <a-input-number 
                            id="inputNumber" 
                            v-model="form.amount"
                            style="width:100%;" 
                            :precision="precision"
                            @change="amountOnChange"
                            :min="0"
                            :max="2147483647"
                            placeholder="请输入金额"
                        />
                    </a-form-model-item>
                    
                    <a-form-model-item ref="collection" label="记账归属" prop="collection" style="width:46%;height:60px;float:left;margin-bottom:0;">
                        <!-- <a-input-number 
                            id="inputNumber" 
                            v-model="form.amount"
                            style="width:100%;" 
                            :precision="precision"
                            @change="amountOnChange"
                            :min="0"
                            :max="2147483647"
                            placeholder="请输入金额"
                        /> -->
                    <a-month-picker 
                        style="width:100%;"  
                        v-model="form.collection" 
                        placeholder="请选择记账归属" 
                        @change="onKeepformChange" />

                    </a-form-model-item>

                    

                    <a-form-model-item ref="remark" label="备注" prop="remark" style="position:relative;margin-left:-200px" >
                        <a-textarea placeholder="请输入"  v-model="form.remark" :rows="4" :maxLength="1024" style="width:1080px" />
                    </a-form-model-item>

                    <a-form-model-item :wrapper-col="{ span: 0, offset: 34 }" style="margin-left:400px">
                        <a-button type="primary" @click="onSubmit">
                            确定
                        </a-button>
                        <a-button style="margin-left: 10px;" @click="cancelForm">
                            取消
                        </a-button>
                    </a-form-model-item>
                </a-form-model>
            </a-drawer>
        </div>

        <div class="select_number">
            <span class="number_span">已选择<b>{{selectNumber}}</b>项</span>
            <span class="clear_span" @click="clearSelect">清空</span>
        </div>
        
        <div class="data_source_list">
            <div class="data_source_details">
                <a-table
                    :loading="tableLoading"
                    :row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }" 
                    :columns="columns" 
                    :data-source="data"
                    :pagination="false"
                    bordered
                    rowKey="id"
                    >
                    <!-- <span slot="warehouse" slot-scope="text, record">
                        {{record.region}}-{{record.city}}-{{record.name}}
                    </span> -->
                    <span slot="financeType" slot-scope="text, record">
                        {{record.financeType=='pay'?'支出':'收入'}}
                    </span>
                    <span slot="financeDetailType" slot-scope="text, record">
                        {{record.financeDetailType=='operation'?'运作类':record.financeDetailType=='fixed'?'固定类':'临时类'}}
                    </span>
                    <a slot="action" slot-scope="text, record" href="javascript:;">
                        <span style="margin-right:8px;" @click="editDrawer(record)">修改</span>
                        <span @click="showModal(record)">删除</span>
                    </a>
                </a-table>
                <!-- 确认删除对话框 -->
                <DelModal 
                    :visible="editVisible"
                    @ok="handleOk"
                    @cancel="handleNo"/>
                <a-modal
                    title="导出确认"
                    :visible="exportVisible"
                    @ok="exportHandleOk"
                    @cancel="exportHandleCancel"
                >
                    <span>确定导出？</span>
                </a-modal>
                    <div style="width: 100%;
                        height: 32px;
                        margin-top: 10px;">
                        <a-pagination
                            style="float:right;margin-right:10px;" 
                            :pageSizeOptions="pageSizeOptions"
                            :total="total" 
                            v-model="pageNo"
                            show-size-changer 
                            show-quick-jumper 
                            :show-total="(total, range) => `${range[0]}-${range[1]} 共 ${total} 条`"
                            @change="pageChange"
                            @showSizeChange="sizeChange"
                        />
                    </div>
                <!-- 底部分页组件 -->
                <!-- <BottomPagination
                    v-model="pageNo"
                    :total="total"
                    @pageChange="pageChange"
                    @sizeChange="sizeChange"
                ></BottomPagination> -->
            </div>
            <!-- 批量删除对话框 -->
            <DelModal 
                :visible="batchDeleteVisible"
                :loading="batchDeleteConfirmLoading"
                @ok="batchDeleteHandleOk"
                @cancel="batchDeleteHandleCancel"/>

            <!-- 导入对话框 -->
            <div class="importModal">
                <a-modal :width="800"  :footer="null" :closable="false" v-model="isImportModal" title="导入">
                    <div class="importModal-content">
                        <span><b style="color:red;">*</b> 仓库：</span>
                        <a-select
                            disabled
                            show-search
                            :filter-option="filterOption" 
                            style="width: 195px" 
                            @change="warehouseChange" 
                            v-model="organizeId"
                            placeholder="请选择仓库"
                        >
                            <a-select-option :key="index" v-for="(item, index) in warehouseList" :value="item.id">
                                {{item.name}}
                            </a-select-option>
                        </a-select>
                        <span><b style="color:red;">*</b>客户：</span>
                            <a-select style="width: 195px"
                                show-search
                                :filter-option="filterOption"
                                @change="customerChange2" 
                                v-model="customerCode2" 
                                allowClear
                                placeholder="请选择客户"
                            >
                                <a-select-option :key="index" v-for="(item, index) in customerList2" :value="item.customerCode">
                                    {{item.customerName}}
                                </a-select-option>
                            </a-select>
                         <a-upload
                            accept=".xls,.xlsx"
                            name="file"
                            :beforeUpload="beforeUpload"
                            :data="uploadData"
                            :showUploadList="false"
                            :multiple="false"
                            :action="uploadUrl"
                            :headers="tokenHeader"
                            @change="uploadChange"
                        >
                            <a-button :disabled="isVaild"> <a-icon type="upload" /> 选择文件 </a-button>
                        </a-upload>
                    </div>
                </a-modal>
            </div>
            
        </div>

        <!-- 统一导入结果弹窗 -->
        <ImportResultVue
            ref="ImportResultRef"
            @close="isResultModal = false"
            @pageChange="resultPageChange"
            @pageNoChange="pageNoChange"
            :current.sync="current"
            :width="1200"
            title="财务收支记账导入失败"
            :result-total="resultTotal"
            :isResultModal.sync="isResultModal" 
            :columns="resultColumns" 
            :data-source="twoResultData" />
    </div>
</template>

<script>
    const columns = [
        {
            title: '序号',
            dataIndex: 'index',
            key: 'index',
            align: 'center',
            ellipsis: true,
            width: 80,
            customRender:(taxe,records,index)=>`${index + 1}`
        },
        // {
        //     title: '仓库',
        //     dataIndex: 'warehouse',
        //     key: 'warehouse',
        //     align: 'center',
        //     width: '15%',
        //     ellipsis: true,
        //     scopedSlots: { 
        //         customRender: 'warehouse',
        //     },
        // },
        {
            title: '收支项名称',
            dataIndex: 'financeName',
            key: 'financeName',
            align: 'center',
            ellipsis: true,
        },
        {
            title: '收支类型',
            dataIndex: 'financeType',
            key: 'financeType',
            align: 'center',
            scopedSlots: { 
                customRender: 'financeType' 
            },
            ellipsis: true,
        },
        {
            title: '明细分类',
            dataIndex: 'financeDetailType',
            key: 'financeDetailType',
            align: 'center',
            scopedSlots: { 
                customRender: 'financeDetailType' 
            },
            ellipsis: true,
        },
        {
            title: '客户',
            dataIndex: 'customerCode',
            key: 'customerCode',
            align: 'center',
            ellipsis: true,
        },
        {
            title: '货主',
            dataIndex: 'ownerCode',
            key: 'ownerCode',
            align: 'center',
            ellipsis: true,
        },
        {
            title: '金额',
            dataIndex: 'amount',
            key: 'amount',
            align: 'center',
            ellipsis: true,
        },
        {
            title: '记账归属',
            dataIndex: 'billTime',
            key: 'billTime',
            align: 'center',
            ellipsis: true,
        },
        {
            title: '备注',
            dataIndex: 'remark',
            key: 'remark',
            align: 'center',
            ellipsis: true,
        },
        {
            title: '创建人',
            dataIndex: 'createBy',
            key: 'createBy',
            align: 'center',
            ellipsis: true,
        },
        {
            title: '创建时间',
            dataIndex: 'createTime',
            key: 'createTime',
            align: 'center',
            ellipsis: true,
        },
        {
            title: '修改人',
            dataIndex: 'updateBy',
            key: 'updateBy',
            align: 'center',
            ellipsis: true,
        },
        {
            title: '修改时间',
            dataIndex: 'updateTime',
            key: 'updateTime',
            align: 'center',
            ellipsis: true,
        },
        { 
            title: '操作', 
            dataIndex: 'action', 
            key: 'action', 
            scopedSlots: { 
                customRender: 'action' 
            },
            align: 'center',
            width: '120px',
        },
    ];

    // 导入结果表头
    const resultColumns = [
        {
            title: '序号',
            dataIndex: 'index',
            key: 'index',
            align: 'center',
            ellipsis: true,
            width: 50,
            customRender:(taxe,records,index)=>`${index + 1}`
        },
        {
            title: '客户',
            dataIndex: 'customerCode',
            key: 'customerCode',
            align: 'center',
            width: 80,
            ellipsis: true,
        },
        {
            title: '货主',
            dataIndex: 'ownerName',
            key: 'ownerName',
            align: 'center',
            width: 80,
            ellipsis: true,
        },
        {
            title: '收支项名称',
            dataIndex: 'financeName',
            key: 'financeName',
            align: 'center',
            width: 80,
            ellipsis: true,
        },
        {
            title: '金额',
            dataIndex: 'amount',
            key: 'amount',
            align: 'center',
            width: 80,
            ellipsis: true,
        },
        {
            title: '记账归属',
            dataIndex: 'billTime',
            key: 'billTime',
            align: 'center',
            width: 80,
            ellipsis: true,
        },
        {
            title: '备注',
            dataIndex: 'remark',
            key: 'remark',
            align: 'center',
            width: 80,
            ellipsis: true,
        },
        {
            title: '结果',
            dataIndex: 'errorMsg',
            key: 'errorMsg',
            width: 250,
            scopedSlots: { 
                customRender: 'action' 
            },
            // align: 'center',
            ellipsis: true,
        },
    ] 

    import Vue from 'vue'
    import { downLoadTemp } from '@/utils/util.js'
    import { ACCESS_TOKEN, TENANT_ID } from "@/store/mutation-types"
    import DelModal from '@/components/base/delModal.vue'
    import TopSelect from '../../../meter/TopSelect'
    import BottomPagination from '../../../meter/BottomPagination'
    import { getTemporaryList,addTemporary,downTemp,getREList, editTemporary, getREName, deleteTemporary, getHeadquarters, getRegion, getCity, getWarehouse, getCustomerName, getOwnerName,Temporaryexport,exportCheckk } from '@/api/api'
    import { downFile } from '@/api/manage'
    import moment from 'moment'//导入文件
    import { random } from 'xe-utils/methods';
    import importFileMixin from '@/mixins/importFileMixin';
    import ImportResultVue from '@/components/modal/ImportResult.vue';
    export default {
        name: "TemporaryRecord",
        mixins:[importFileMixin],
        components: {
            TopSelect,
            BottomPagination,
            DelModal,
            ImportResultVue   
        },
        data () {
            return {
                code: '',
                precision: 2,
                tempType: undefined, // 临时收支类型
                categoryIdList: [],
                categoryIdList2: [],
                pageSizeOptions: ['10', '20', '30'],
                isOpen:true,
                collection:undefined,
                collectionTime:undefined,
                data: [],
                detailedType:undefined,
                columns,
                TreeData:[],//树形数据
                resultColumns,
                cascaderValue:[],
                REList:[],//收支分类数据
                fromRelist:[],
                options:[
                    {
                    value: 'income',
                    label: '收入',
                    children: [
                        {
                            value: 'operation',
                            label: '运作类',
                            children:[
                                    
                                ]
                        },
                        {
                            value: 'fixed',
                            label: '固定类',
                            children:[
                                    
                                ]
                        },
                        {
                            value: 'temp',
                            label: '临时类',
                            children:[
                                    
                                ]
                        },
                    ],
                    },
                    {
                        value: 'pay',
                        label: '支出',
                        children: [
                            {
                                value: 'operation',
                                label: '运作类',
                                children:[
                                    
                                ]
                            },
                            {
                                value: 'fixed',
                                label: '固定类',
                                children:[
                                    
                                ]
                            },
                            {
                                value: 'temp',
                                label: '临时类',
                                children:[
                                    
                                ]
                            }
                        ],
                    },
                ],
                options2:[
                    {
                    value: 'income',
                    label: '收入',
                    children: [
                        {
                            value: 'operation',
                            label: '运作类',
                            children:[
                                    
                                ]
                        },
                        {
                            value: 'fixed',
                            label: '固定类',
                            children:[
                                    
                                ]
                        },
                        {
                            value: 'temp',
                            label: '临时类',
                            children:[
                                    
                                ]
                        },
                    ],
                    },
                    {
                        value: 'pay',
                        label: '支出',
                        children: [
                            {
                                value: 'operation',
                                label: '运作类',
                                children:[
                                    
                                ]
                            },
                            {
                                value: 'fixed',
                                label: '固定类',
                                children:[
                                    
                                ]
                            },
                            {
                                value: 'temp',
                                label: '临时类',
                                children:[
                                    
                                ]
                            }
                        ],
                    },
                ],
                tableLoading: false,
                selectNumber: 0, // 当前选中数据条数
                selectedRowKeys: [], // 当前选择集合
                deletdBtnShow: false, // 批量删除按钮是否显示
                headquartersId: '', // 总部id
                regionId: undefined, // 大区id
                cityId: undefined, // 城市id
                organizeId: undefined, // 仓库id
                regionList: [],
                cityList: [],
                warehouseList: [],
                customerCode: undefined,
                customerCode2: undefined,
                customerList: [],
                customerList2: [],
                ownerCode: undefined,
                ownerList: [],
                isRegionShow: true,
                isCityShow: true,
                isWareShow: true,
                exportVisible: false, // 导出
                createBy: '', // 创建人
                createTime: [], // 创建时间
                updateBy: '', // 修改人
                updateTime: [], // 修改时间
                createTime_begin: '', // 创建时间开始时间
                createTime_end: '', // 创建时间结束时间
                updateTime_begin: '', // 修改时间开始时间
                updateTime_end: '', // 修改时间结束时间
                dateFormat: 'YYYY-MM-DD HH:mm:ss',
                pageNo: 1,
                pageSize: 10,
                financeName:[],
                financeName2:'',
                total: 0,
                resultPageNo: 1,
                resultPageSize: 10,
                visible: false,
                placement: 'right',
                drawerTitle: '新增财务收支记账',
                labelCol: { span: 7 },  
                wrapperCol: { span: 16 },
                other: '',
                form: {
                    customerCode: '',
                    customerList: [],
                    ownerCode: '',
                    ownerList: [],
                    ownerlist: [],
                    region: '',
                    city: '',
                    name: '',
                    regionId: '', // 大区id
                    cityId: '', // 城市id
                    organizeId: '', // 仓库id
                    categoryId: '',
                    financeName: '',
                    tempType: '',
                    amount: '',
                    remark: '',
                    createBy: '',
                    createTime: [],
                    editBy: '',
                    editTime: [],
                    collection:'',
                    collectionTime:'',
                    cascaderValue:[]
                },
                rules: {
                    collection: [
                        { required: true, message: '请选择记账归属', trigger: 'change', },
                    ],
                    city: [
                        { required: true, message: '请选择城市', trigger: 'change', },
                    ],
                    name: [
                        { required: true, message: '请选择仓库', trigger: 'change', },
                    ],
                    customerCode: [
                        { required: true, message: '请选择客户', trigger: 'change', },
                    ],
                    ownerCode: [
                        { required: false, message: '请选择货主', trigger: 'change', },
                    ],
                    cascaderValue: [
                        { required: true, message: '请选择收支项名称', trigger: 'change' },
                    ],
                    tempType: [
                        { required: true, message: '请选择收支类型', trigger: 'change', },
                    ],
                    amount: [
                        { required: true, message: '请输入金额', trigger: 'change', },
                    ],
                },
                validStatus: true, // 当前表单验证状态，true表示成功，false表示失败
                editVisible: false, // 确认删除对话框
                batchDeleteVisible: false, // 批量删除
                batchDeleteConfirmLoading: false,
                regionList: [],
                cityList: [],
                warehouseList: [],
                regionName: '', // 大区名称
                cityName: '', // 城市名称
                warehouseName: '', // 仓库名称
                addMode: true,
                disabled: false,
                id: '',
                ids: '',
                // 导出
                url: {
                    exportUrl: '/biz/financeTemp/exportXls',
                    uploadUrl: '/biz/financeTemp/importXls',
                },

                // 导入弹窗所需
                isImportModal:false,
                // isVaild:false,

            }
        },
        created() {
            this.getHeadquartersList()
            this.formGetHeadquartersList()
            this.getReList()
        },
        computed: {
            isVaild(){
                return (this.organizeId===''||this.organizeId===undefined)||(this.customerCode2===''||this.customerCode2===undefined)
            }
        },
        methods: {
            // 选择框过滤
            filterOption(input, option) {
                return (
                    option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
                );
            },
            // 搜索
            onSearch() {
                if( (this.regionId == '' || this.regionId == undefined) || (this.cityId == '' || this.cityId == undefined) || (this.organizeId == '' || this.organizeId == undefined) ){
                    this.$message.warning('搜索时必须先选择大区、城市和仓库！')
                }else{
                    this.$nextTick(()=>{
                        this.pageNo=1
                        this.pageChange(this.pageNo,this.pageSize)
                    })
                    // this.getTemporaryList()
                }
                this.selectNumber = 0
                this.selectedRowKeys = []
                this.deletdBtnShow = false
            },
            // 重置
            onReset() {
                this.regionId = undefined
                this.financeName = []
                this.financeName2 = ''
                this.cityId = undefined
                this.categoryId = ''
                this.tempType = undefined
                this.form.customerCode= ''
                this.form.ownerCode = ''
                this.projectName = ''
                this.organizeId = undefined
                this.cityList = []
                this.ruleStatus= ''
                this.createBy= ''
                this.updateBy = ''
                this.form.remark = ''
                this.warehouseList = []
                this.pageSize = 10
                this.pageNo = 1
                this.total = 0
                this.data = []
                this.selectNumber = 0
                this.selectedRowKeys = []
                this.deletdBtnShow = false
                this.customerCode = undefined
                this.customerList = []
                this.ownerCode = undefined
                this.ownerList = []
                this.createTime = undefined
                this.updateTime = undefined
                this.detailedType= undefined
                this.collection= undefined
                this.collectionTime= undefined
            },
           doExport(){
               if( this.regionId == '' || this.cityId == '' || this.organizeId == '' ){
                    this.$message.warning('导出时必须先选择大区、城市和仓库！')
                    return
                }
                if(this.selectedRowKeys.length <= 0){
                    this.$message.warning('请先勾选需要导出的项！')
                    return
                }
                this.exportVisible = true;
                this.ids = this.selectedRowKeys.join(',')
            },
            changeCascaderValue(val,data){
                console.log(val)
                console.log(arguments)
                this.form.categoryId = data[2].id
            },
            onKeepformChange(e,data){
                this.form.collectionTime = data
            },
            getReList(){
                let paramsName = {
                    organizeId: this.form.organizeId,
                }
                 getREName(paramsName).then((res)=>{
                    if(res.success){
                        // console.log(res.result)
                        // // res.result.records.forEach(item=>{
                        // res.result.forEach(item=>{
                        //     item['value'] = item.financeName
                        //     item['label'] = item.financeName
                        // })
                        // this.fromRelist = res.result
                        // for (let i = 0; i < this.options.length; i++) {
                        //     for (let j = 0; j < this.options[i].children.length; j++) {
                        //        for (let k = 0; k < this.fromRelist.length; k++) {
                        //             if(this.options[i].children[j].value===this.fromRelist[k].financeDetailType&&this.options[i].value===this.fromRelist[k].financeType){
                        //                 if(this.options[i].children[j].isPrototypeOf('children')){
                        //                     this.options[i].children[j]['children'].push(this.fromRelist[k])
                        //                 }else{
                        //                     this.options[i].children[j]['children'] = []
                        //                     this.options[i].children[j]['children'].push(this.fromRelist[k])
                        //                 }
                        //                 // if(this.options[i].children[j].value==='operation'&&this.options[i].value==='pay'){
                        //                 //     this.options[i].children[j]['children'].push({   
                        //                 //         id:'-1',
                        //                 //         financeType:'pay',
                        //                 //         financeDetailType:'operation',
                        //                 //         value:'理赔费',
                        //                 //         label:'理赔费'
                        //                 //     })
                        //                 // }
                        //             }
                        //        }
                        //     }
                            
                        // }
                        // this.fromRelist.forEach(item=>{
                        //     this.options.forEach(item1=>{
                        //         item1.children.forEach(item2=>{
                        //             if(item.financeType==item1.value&&item.financeDetailType==item2.value){
                        //                 console.log(item,'item')

                        //                 // if(item2.isPrototypeOf('children')){
                        //                 //     console.log(item)
                        //                 //     item2.children.push(item)
                        //                 // }else{
                        //                 //     console.log(item)
                        //                     item2['children'] = []
                        //                     item2.children.push(item)
                        //                     console.log(item2.children)
                        //                 // }
                        //             }
                        //         })
                        //     })
                        // })
                        // this.fromRelist =[
                        //     {
                        //         id:1,
                        //         financeType:'收入',
                        //         financeDetailType:'运作类',
                        //         financeName:'demo',
                        //         value:'demo2',
                        //         label:'demo4'
                        //     },
                        //     {
                        //         id:1,
                        //         financeType:'收入',
                        //         financeDetailType:'明细类',
                        //         financeName:'demo1',
                        //         value:'demo3',
                        //         label:'demo5'
                        //     },
                        // ]
                        console.log(this.options)
                        console.log(this.fromRelist,'fromRelist')
                    }else{
                        this.$message.warning(res.message)
                    }
                })
                // getREList({delFlag: 0,organizeId:this.organizeId,pageSize:10000}).then((res)=>{
                    
                // })
                // getREName({organizeId:this.organizeId}).then((res)=>{
                //     if(res.success){
                //         this.fromRelist = res.result
                //         // this.fromRelist =[
                //         //     {
                //         //         id:1,
                //         //         financeType:'收入',
                //         //         financeDetailType:'运作类',
                //         //         financeName:'demo',
                //         //         value:'demo2',
                //         //         label:'demo4'
                //         //     },
                //         //     {
                //         //         id:1,
                //         //         financeType:'收入',
                //         //         financeDetailType:'明细类',
                //         //         financeName:'demo1',
                //         //         value:'demo3',
                //         //         label:'demo5'
                //         //     },
                //         // ]
                //         console.log(this.fromRelist,'fromRelist')
                //     }else{
                //         this.$message.warning(res.message)
                //     }
                // })
            },
            loadData(selectedOptions){
                console.log(selectedOptions)
                const targetOption = selectedOptions[selectedOptions.length - 1];
                targetOption.loading = true;
                    let arr = []
                    targetOption.loading = false
                    console.log(this.fromRelist,'fromRelist')
                    for (let index = 0; index < this.fromRelist.length; index++) {
                        const element = this.fromRelist[index];
                        console.log(element)
                        if(this.fromRelist[index].financeType==selectedOptions[0].value
                        &&this.fromRelist[index].financeDetailType==selectedOptions[1].value){
                            this.fromRelist[index]['value'] = this.fromRelist[index].financeName
                            this.fromRelist[index]['label'] = this.fromRelist[index].financeName
                            arr.push(this.fromRelist[index])
                        }
                    }
                    // if(selectedOptions[0].value==='pay'
                    // &&selectedOptions[1].value==='operation'){
                    //     arr.push({
                    //         value:'理赔费',
                    //         label:'理赔费',
                    //     })
                    // }
                    console.log(arr,'arr')
                    targetOption.children = arr
                    this.options = [...this.options];
            },
            fincenameChange(val){
                console.log(val)
                this.financeName2 = val.join(',')
                console.log(this.financeName2)
            },
            handleTypeChange(val){
                console.log(val)
                // this.REList =  this.REList.filter(v=>v.financeType===val)
                console.log(this.REList)
            },
            handleIficationChange(val){
                console.log(val)
                // this.REList =  this.REList.filter(v=>v.financeDetailType===val)
                console.log(this.REList)
            },
            onKeepChange(e,date){
                this.collectionTime = date
            },
            // 获取导入结果数据
            getImportResultData(){
                let params = {
                    pageNo:this.resultPageNo,
                    pageSize:this.resultPageSize
                }
                console.log(params)
            },
            // 导入
            doImport(){
                if( (this.regionId == '' || this.regionId == undefined) || (this.cityId == '' || this.cityId == undefined) || (this.organizeId == '' || this.organizeId == undefined) ){
                    this.$message.warning('导入时必须先选择大区、城市和仓库！')
                    return
                }
                this.customerCode2 = undefined
                this.isImportModal = true
            },
            // 上传钩子函数
            beforeUpload(file,fileInfo){
                let isExcal = file.name.split('.')[1]
                if(isExcal=='xls'||isExcal=='xlsx'){
                    return true
                }else{
                    this.$message.error(`导入表格仅支持xls、xlsx格式！`, 6);
                    return false
                }
            },
            // 导入
            uploadChange(info) {
                if (info.file.status !== 'uploading') {
                    console.log(info.file);
                }
                if (info.file.status === 'done') {
                    if (info.file.response.success) {
                        this.$message.success(`${info.file.name}文件上传成功！`);
                        this.isImportModal = false
                    }else{
                        // ，${info.file.response.message}
                        this.$message.error(`${info.file.name}文件上传失败！`, 6);
                            this.isImportModal = false
                            this.isResultModal = true
                            if(Array.isArray(info.file.response.result)){
                            this.resultData = info.file.response.result
                            this.resultData.forEach(item=>{
                                item['id'] =  Date.now()+Math.random().toString() 
                                item['customerCode'] = this.customerCode2
                            })
                            console.log(this.resultData,'this.resultData')
                            if(info.file.response.result.length){
                                this.resultTotal =  info.file.response.result.length

                            }else{
                                 this.resultTotal = 0
                            }
                            if(info.file.response.result.length<10){
                                this.twoResultData =  info.file.response.result
                            }else{
                                this.twoResultData =  info.file.response.result.slice(0,10)
                            }
                        }
                    }
                } else if (info.file.status === 'error') {
                    this.$message.error(`${info.file.name}文件上传失败！`, 6);
                }
            },
            // 下载模板
           async dowmloadTempalte(){
                console.log('dowmloadTempalte')
                let params = {
                    paramKey:'finance_temp_import_excel_template_url',
                    whetherBusiness:1,
                    configSwitch:0
                }   
                 downTemp(params).then((res=>{
                    console.log(res)
                    if(res.success){
                        if(res.result.length>0){
                            let url = res.result[0].paramValue
                           downFile(url).then((data)=>{
                               downLoadTemp(data,'财务收支记账导入表格')
                            })
                        }
                    }
                })).catch((err)=>{
                    this.$message.warning(err.message)
                })
            },
            exportHandleOk(e) {
                this.exportConfirmLoading = true;
                
                let params = {
                    id: this.ids,
                    organizeId: this.organizeId,
                    whCode: this.code,
                    ruleType: this.ruleType,
                    projectName: this.projectName,
                    createBy: this.createBy,
                    updateBy: this.updateBy,
                    createTime_begin: this.createTime_begin,
                    createTime_end: this.createTime_end,
                    updateTime_begin: this.updateTime_begin,
                    updateTime_end: this.updateTime_end,
                    pageSize: this.pageSize,
                    pageNo: this.pageNo,
                    delFlag: 0,
                }
                
                exportCheckk(params).then((data)=>{
                    if (!data) {
                        this.$message.warning("文件下载失败")
                        return
                    }
                    if (typeof window.navigator.msSaveBlob !== 'undefined') {
                        window.navigator.msSaveBlob(new Blob([data],{type: 'application/vnd.ms-excel'}), '临时收支记账'+'.xls')
                    }else{
                        let url = window.URL.createObjectURL(new Blob([data],{type: 'application/vnd.ms-excel'}))
                        let link = document.createElement('a')
                        link.style.display = 'none'
                        link.href = url
                        link.setAttribute('download', '临时收支记账'+'.xls')
                        document.body.appendChild(link)
                        link.click()
                        document.body.removeChild(link); //下载完成移除元素
                        window.URL.revokeObjectURL(url); //释放掉blob对象
                        this.selectNumber = 0
                        this.selectedRowKeys = []
                        this.deletdBtnShow = false
                        this.exportVisible = false;
                        this.exportConfirmLoading = false;
                    }
                })
            },
            exportHandleCancel(e) {
                this.exportVisible = false;
            },
            // 获取列表数据
            getTemporaryList() {

                let params = {
                    regionId: this.regionId,
                    cityId: this.cityId,
                    organizeId: this.organizeId,
                    categoryId: this.financeName2,
                    customerCode: this.customerCode,
                    ownerCode: this.ownerCode,
                    financeType: this.tempType,
                    createBy: this.createBy,
                    updateBy: this.updateBy,
                    createTime_begin: this.createTime_begin,
                    createTime_end: this.createTime_end,
                    updateTime_begin: this.updateTime_begin,
                    updateTime_end: this.updateTime_end,
                    pageSize: this.pageSize,
                    pageNo: this.pageNo,
                    financeDetailType:this.detailedType,
                    billTime:this.collectionTime,
                    delFlag: 0,
                }
                this.tableLoading = true
                getTemporaryList(params).then((res)=>{
                    this.tableLoading = false
                    if(res.success){
                        this.data = res.result.records
                        this.total = res.result.total
                    }else{
                        this.$message.warning(res.message)
                    }
                })
            },
            // 获取收支项名称
            getREName() {
                this.$nextTick(()=>{
                    this.options = JSON.parse(JSON.stringify(this.options2))
                    this.fromRelist = []
                })
                let params = {
                    organizeId: this.organizeId,
                }
                getREName(params).then((res)=>{
                    if(res.success){
                        console.log(res.result)
                        // res.result.records.forEach(item=>{
                        res.result.forEach(item=>{
                            item['value'] = item.financeName
                            item['label'] = item.financeName
                        })
                        this.REList = res.result
                        this.fromRelist = res.result
                        for (let i = 0; i < this.options.length; i++) {
                            for (let j = 0; j < this.options[i].children.length; j++) {
                               for (let k = 0; k < this.fromRelist.length; k++) {
                                    if(this.options[i].children[j].value===this.fromRelist[k].financeDetailType&&this.options[i].value===this.fromRelist[k].financeType){
                                        this.options[i].children[j]['children'].push(this.fromRelist[k])
                                    }
                               }
                            }
                            
                        }
                        this.REList = res.result
                        this.categoryIdList = res.result.filter(v => v.financeType === '临时类')
                    }else{
                        this.$message.warning(res.message)
                    }
                })
            },
            // 收支项名称
            categoryIdChange(value) {
                this.categoryId = value
            },
            // 收支类型
            handleChange(value) {
                console.log(`selected ${value}`);
            },
            // 选中
            onSelectChange(selectedRowKeys) {
                this.selectedRowKeys = selectedRowKeys
                this.selectNumber = selectedRowKeys.length
                if(this.selectedRowKeys.length > 0){
                    this.deletdBtnShow = true
                }else{
                    this.deletdBtnShow = false
                }
            },
            // 清空选中
            clearSelect() {
                this.selectNumber = 0
                this.selectedRowKeys = []
                this.deletdBtnShow = false
            },
            // 获取总部
            getHeadquartersList(){
                let params = {}
                getHeadquarters(params).then((res)=>{
                    if(res.success){
                        console.log(res,'-----------')
                        this.headquartersId = res.result.organizeOrgList[0].id
                        this.getRegionList()
                    }
                })
            },
            // 获取大区
            getRegionList(){
                let params = {id: this.headquartersId}
                getRegion(params).then((res)=>{
                    if(res.success){
                        this.regionList = res.result.organizeOrgList
                        if(this.regionList.length === 1){
                            this.regionId = this.regionList[0].id
                            this.getCityList()
                        }
                    }else{
                        this.$message.warning(res.message, 6)
                    }
                })
            },
            // 选择大区
            regionChange(value){
                console.log(value,arguments,this.regionList)
                this.regionId = value 
                this.cityId = undefined
                this.organizeId = undefined
                this.customerCode = undefined
                this.ownerCode = undefined
                this.cityList = []
                this.warehouseList = []
                this.getCityList()
                this.customerList = []
                this.ownerList = []
                for (var item of this.regionList) {
                    if(item.id === this.regionId){
                        console.log(item.name)
                        this.region = item.name
                    }
                }
            },
            // 获取城市
            getCityList(){
                let params = {
                    areaIds: this.regionId
                }
                getCity(params).then((res)=>{
                    if(res.success){
                        this.cityList = res.result.organizeOrgList
                        if(this.cityList.length === 1){
                            this.cityId = this.cityList[0].id
                            this.getWarehouseList()
                        }
                    }
                })
            },
            // 选择城市
            cityChange(value){
                this.cityId = value
                this.warehouseList = []
                this.getWarehouseList()
                this.customerList = []
                this.ownerList = []
                this.organizeId = undefined
                this.customerCode = undefined
                this.ownerCode =undefined
                for (var item of this.cityList) {
                    if(item.id === this.cityId){
                        console.log(item.name)
                        this.city = item.name
                    }
                }
            },
            // 获取仓库
            getWarehouseList(){
                let params = {
                    cityIds: this.cityId
                }
                getWarehouse(params).then((res)=>{
                    if(res.success){
                        this.warehouseList = res.result.organizeOrgList
                        if(this.warehouseList.length === 1){
                            this.organizeId = this.warehouseList[0].id
                            this.code = this.warehouseList[0].code
                            this.onSearch()
                            this.getREName()
                            this.getCustomerName()
                        }
                    }
                })
            },
            // 选择仓库
            warehouseChange(value){
                this.organizeId = value
                this.customerCode = undefined
                this.ownerCode = undefined
                for(var item of this.warehouseList) {
                    if(item.id === this.organizeId) {
                        this.code = item.code
                        this.name = item.name
                        this.customerList = []
                        this.ownerList = []
                        this.getCustomerName()
                        this.getREName()
                    }
                }
                // this.getTemporaryList()
            },
            // 获取客户名称列表
            getCustomerName() {
                let params = {
                    whCode: this.code,
                }
                getCustomerName(params).then((res)=>{
                    if(res.success){
                        console.log(result)
                        let result = JSON.parse(JSON.stringify(res.result))
                        this.customerList = res.result
                        this.customerList.push({
                            customerCode: "不属于客户",
                            customerName: "不属于客户",
                            id: -1,
                            whCode: "不属于客户"}
                        )
                        this.customerList2 = result
                        this.customerList2.push({
                            customerCode: "不属于客户",
                            customerName: "不属于客户",
                            id: -1,
                            whCode: "不属于客户"}
                        )
                        
                        this.form.customerList = res.result
                        console.log(this.form.customerList)
                    }else{
                        this.$message.warning(res.message, 6)
                    }
                })
            },
            // 选择客户
            customerChange() {
                this.ownerCode = undefined
                if(this.customerCode) {
                    this.getOwnerName()
                }
            },
             // 选择客户
            customerChange2() {
                this.ownerCode = undefined
                this.uploadData = {
                    whCode:this.code,
                    regionId: this.regionId,
                    region: this.region, 
                    cityId: this.cityId,
                    city: this.city, 
                    organizeId: this.organizeId,
                    name: this.name, 
                    customerCode: this.customerCode2,
                }
            },
            // 获取货主名称列表
            getOwnerName() {
                let params = {
                    whCode: this.code,
                    customerCode: this.customerCode,
                }
                getOwnerName(params).then((res)=>{
                    if(res.success){
                        this.ownerList = res.result
                    }else{
                        this.$message.warning(res.message, 6)
                    }
                })
            },

            // 获取当前页数、条数
            pageChange(data1, data2) {
                this.pageNo = data1
                this.pageSize = data2
                this.getTemporaryList()
            },
            // 获取当前页数、条数
            sizeChange(data1, data2) {
                this.pageNo = data1
                this.pageSize = data2
                this.getTemporaryList()
            },
            // 新增收支项
            showDrawer() {
                if( (this.regionId == '' || this.regionId == undefined) || (this.cityId == '' || this.cityId == undefined) || (this.organizeId == '' || this.organizeId == undefined) ){
                    this.$message.warning('新增时必须先选择大区、城市和仓库！')
                    return
                }
                this.visible = true;
                this.drawerTitle = '新增财务收支记账'
                this.addMode = true
                this.disabled = false
                this.form.collection = undefined
                this.form.collectionTime = undefined
                this.form.region = undefined
                this.form.city = undefined
                this.form.name = undefined
                this.form.customerCode = undefined
                this.form.customerList = []
                this.form.cascaderValue = []
                this.form.ownerCode = undefined
                this.form.ownerList = []
                this.form.financeName = ''
                this.form.categoryId = ''
                this.form.tempType = undefined
                this.form.amount = ''
                this.form.remark = ''
                // 只有验证失败，新增的时候才重置验证状态
                if(this.validStatus === false) {
                    this.$refs.ruleForm.resetFields()
                }

                // this.cityList = []
                // this.warehouseList = []
                // this.categoryIdList2 = []

                this.getHeadquartersList()
                // this.getTreeData()
            },
            onClose() {
                this.visible = false;
            },
            // 创建时间
            createChange(value, dateString) {
                this.createTime = value
                this.createTime_begin = dateString[0]
                this.createTime_end = dateString[1]
            },
            createOk(value) {
                console.log('onOk: ', value);
            },
            // 修改时间
            editChange(value, dateString) {
                this.updateTime = value
                this.updateTime_begin = dateString[0]
                this.updateTime_end = dateString[1]
            },
            editOk(value) {
                console.log('onOk: ', value);
            },
            // 修改收支项
            editDrawer(record) {
                console.log(record,'record')
                this.visible = true;
                this.drawerTitle = '修改财务收支记账'
                this.addMode = false
                this.disabled = true
                this.id = record.id
                this.form.customerCode = record.customerCode
                // this.form.cascaderValue = record.financeName.split(',')
                this.form.cascaderValue = [record.financeType,record.financeDetailType,record.financeName]
                this.form.collection = moment(record.billTime,'YYYY-MM')
                this.form.collectionTime = record.billTime
                // this.form.collection = moment(record.billTime,'YYYY-MM')
                // this.form.collectionTime = record.billTime
                this.form.ownerCode = record.ownerCode
                this.form.region = record.region
                this.form.city = record.city
                this.form.name = record.name
                this.form.financeName = record.financeName
                this.form.categoryId = record.categoryId
                this.form.tempType = record.tempType
                this.form.amount = record.amount
                this.form.remark = record.remark
                // 只有验证失败，新增的时候才重置验证状态
                if(this.validStatus === false) {
                    this.$refs.ruleForm.resetFields()
                }
                this.formGetRegionList()
                this.formGetWarehouseList()
                // this.formCustomerChange()
                this.formCustomerChanges()
                this.formOwnerChange()
            },
            // 表单
            onSubmit() {
                this.$refs.ruleForm.validate(valid => {
                    if (valid) {
                        this.validStatus = true
                        if(this.addMode){ // 新增
                            let finace = this.form.cascaderValue
                            let params = {
                                region: this.region,
                                regionId: this.regionId,
                                city: this.city,
                                cityId: this.cityId,
                                name: this.name,
                                organizeId: this.organizeId,
                                ownerCode: this.form.ownerCode,
                                customerCode: this.form.customerCode,
                                // financeName: this.form.cascaderValue.join(','),
                                categoryId: this.form.categoryId,
                                tempType: this.form.tempType,
                                amount: this.form.amount,
                                remark: this.form.remark,
                                billTime:this.form.collectionTime
                            }
                            if(finace.length===3){
                                let obj =   {
                                    financeName:finace[2],
                                    financeType:finace[0],
                                    financeDetailType:finace[1],
                                    // categoryId:finace[2],
                                }
                                var param =  Object.assign(obj,params)
                            }else{
                                let obj =   {
                                    // categoryId:'',
                                    financeName:'',
                                    financeType:finace[0],
                                    financeDetailType:finace[1]
                                }
                                var param =  Object.assign(obj,params)
                            }

                            // console.log(param,this.form.cascaderValue)
                            // return
                            addTemporary(param).then((res)=>{
                                if(res.success){
                                    this.visible = false
                                    if( this.regionId !== '' && this.cityId !== '' && this.organizeId !== '' ){
                                        this.getTemporaryList()
                                    }
                                }else{
                                    this.$message.warning(res.message)
                                }
                            })
                        }else{ // 修改
                        let finace = this.form.cascaderValue
                            let params = {
                                id: this.id,
                                ownerCode: this.form.ownerCode,
                                customerCode: this.form.customerCode,
                                // financeName: this.form.financeName,
                                categoryId: this.form.categoryId,
                                // tempType: this.form.tempType,
                                amount: this.form.amount,
                                remark: this.form.remark,
                                billTime:this.form.collectionTime
                            }
                            if(finace.length===3){
                                let obj =   {
                                    financeName:finace[2],
                                    financeType:finace[0],
                                    financeDetailType:finace[1]
                                }
                                var param =  Object.assign(obj,params)
                            }else{
                                let obj =   {
                                    financeName:'',
                                    financeType:finace[0],
                                    financeDetailType:finace[1]
                                }
                                var param =  Object.assign(obj,params)
                            }
                            // let params = {
                            //     id: this.id,
                            //     ownerCode: this.form.ownerCode,
                            //     customerCode: this.form.customerCode,
                            //     financeName: this.form.financeName,
                            //     categoryId: this.form.categoryId,
                            //     tempType: this.form.tempType,
                            //     amount: this.form.amount,
                            //     remark: this.form.remark,
                            // }
                            editTemporary(param).then((res)=>{
                                if(res.success){
                                    this.visible = false
                                    this.getTemporaryList()
                                }else{
                                    this.$message.warning(res.message)
                                }
                            })
                        }
                    } else {
                        this.validStatus = false
                        return false;  
                    } 
                });
                },
            cancelForm() {
                this.visible = false;
                this.$refs.ruleForm.resetFields();
            },
            // 确认删除对话框
            showModal(record) {
                this.editVisible = true;
                this.ids = record.id
            },
            handleOk(e) {
                let params = {
                    ids: this.ids,
                }
                deleteTemporary(params).then((res)=>{
                    if(res.success){
                        this.editVisible = false
                        this.getTemporaryList()
                    }else{
                        this.$message.warning(res.message)
                    }
                })
            },
            handleNo(){
                this.editVisible = false
            },
            
            categoryIdFormChange(value) {
                this.form.categoryId = value
                for (var item of this.categoryIdList2) {
                    if(item.id === this.form.categoryId){
                        this.form.financeName = item.financeName
                    }
                }
            },
            // 金额输入框
            amountOnChange(value) {
                this.form.amount = value
            },
            // 批量删除
            batchDelete() {
                this.batchDeleteVisible = true
                this.ids = this.selectedRowKeys.join(',')
            },
            batchDeleteHandleOk(e) {
                let params = {
                    ids: this.ids,
                }
                deleteTemporary(params).then((res)=>{
                    if(res.success){
                        this.batchDeleteVisible = false
                        this.batchDeleteConfirmLoading = false
                        this.selectNumber = 0
                        this.selectedRowKeys = []
                        this.deletdBtnShow = false
                        this.getTemporaryList()
                        this.$message.success('删除成功')
                    }else{
                        this.$message.warning('未选中数据不能删除')
                        this.batchDeleteVisible = false
                    }
                })
            },
            batchDeleteHandleCancel(e) {
                this.batchDeleteVisible = false;
            },

            // 表单选择大区、城市、仓库
            // 获取总部
            formGetHeadquartersList(){
                let params = {}
                getHeadquarters(params).then((res)=>{
                    if(res.success){
                        this.headquartersId = res.result.organizeOrgList[0].id
                        this.formGetRegionList()
                    }
                })
            },
            // 获取大区
            formGetRegionList(){
                let params = {id: this.headquartersId}
                getRegion(params).then((res)=>{
                    if(res.success){
                        this.regionList = res.result.organizeOrgList
                        if(this.regionList.length == 1){
                            this.form.regionId = res.result.organizeOrgList[0].id
                            this.form.region = res.result.organizeOrgList[0].name
                            this.formGetCityList()
                        }
                    }
                })
            },
            // 选择大区
            formRegionChange(value){
                this.form.regionId = value
                this.form.city= undefined
                this.form.name= undefined
                this.form.customerCode= undefined
                this.form.ownerCode= undefined
                this.cityList = []
                this.warehouseList = []
                this.categoryIdList2 = []
                this.formGetCityList()
                for (var item of this.regionList) {
                    if(item.id === this.form.regionId){
                        this.form.region = item.name
                    }
                }
                
            },
            // 获取城市
            formGetCityList(){
                let params = {
                    areaIds: this.form.regionId
                }
                getCity(params).then((res)=>{
                    if(res.success){
                        this.cityList = res.result.organizeOrgList
                        if(this.cityList.length == 1){
                            this.form.cityId = res.result.organizeOrgList[0].id
                            this.form.city = res.result.organizeOrgList[0].name
                            this.formGetWarehouseList()
                        }
                    }
                })
            },
            // 选择城市
            formCityChange(value){
                this.form.cityId = value
                this.form.name= undefined
                this.form.customerCode= undefined
                this.form.ownerCode= undefined
                this.warehouseList = []
                this.categoryIdList2 = []
                this.formGetWarehouseList()
                for (var item of this.cityList) {
                    if(item.id === this.form.cityId){
                        this.form.city = item.name
                    }
                }
                
            },
            // 获取仓库
            formGetWarehouseList(){
                let params = {
                    cityIds: this.form.cityId
                }
                getWarehouse(params).then((res)=>{
                    if(res.success){
                        this.warehouseList = res.result.organizeOrgList
                        if(this.warehouseList.length == 1){
                            this.form.organizeId = res.result.organizeOrgList[0].id
                            this.form.code = res.result.organizeOrgList[0].code
                            this.form.name = res.result.organizeOrgList[0].name
                            // 表单获取客户
                            let params = {
                                whCode: this.form.code,
                            }
                            getCustomerName(params).then((res)=>{
                                if(res.success){
                                    this.form.customerList = res.result
                                }else{
                                    this.$message.warning(res.message, 6)
                                }
                            })
                            // 表单获取收支项名称
                            let paramsName = {
                                organizeId: this.form.organizeId,
                            }
                            getREName(paramsName).then((res)=>{
                                if(res.success){
                                    this.categoryIdList2 = res.result.filter(v => v.financeType === '临时类')
                                }else{
                                    this.$message.warning(res.message)
                                }
                            })
                        }
                    }
                })
            },
            // 选择仓库
            formWarehouseChange(value){
                this.form.organizeId = value
                this.form.customerCode= undefined
                this.form.ownerCode= undefined
                for (var item of this.warehouseList) {
                    if(item.id === this.form.organizeId){
                        this.form.name = item.name
                        this.form.code = item.code
                        this.form.customerList = []
                        this.form.ownerList = []
                    }
                }
                // 表单获取客户
                let params = {
                    whCode: this.form.code,
                }
                getCustomerName(params).then((res)=>{
                    if(res.success){
                        this.form.customerList = res.result
                    }else{
                        this.$message.warning(res.message, 6)
                    }
                })
                let paramsName = {
                    organizeId: this.form.organizeId,
                }
                getREName(paramsName).then((res)=>{
                    if(res.success){
                        this.categoryIdList2 = res.result.filter(v => v.financeType === '临时类')
                    }else{
                        this.$message.warning(res.message)
                    }
                })
            },
            // 获取表单客户
            formCustomerChanges(){
                let params = {
                    whCode: this.code,
                }
                getCustomerName(params).then((res)=>{
                    if(res.success){
                        this.form.customerList = res.result
                    }else{
                        this.$message.warning(res.message, 6)
                    }
                })
                let paramsName = {
                    organizeId: this.form.organizeId,
                }
                getREName(paramsName).then((res)=>{
                    if(res.success){
                        this.categoryIdList2 = res.result.filter(v => v.financeType === '临时类')
                    }else{
                        this.$message.warning(res.message)
                    }
                })
            },
            // 表单客户
            formCustomerChange() {
                this.form.ownerCode = undefined
                if(this.form.customerCode){
                    let params = {
                        whCode: this.code,
                        customerCode: this.form.customerCode,
                    }
                    getOwnerName(params).then((res)=>{
                        if(res.success){
                            this.form.ownerlist = res.result
                        }else{
                            this.$message.warning(res.message, 6)
                        }
                    })
                }
            },
            // 表单货主
            formOwnerChange() {
                let params = {
                        whCode: this.code,
                        customerCode: this.form.customerCode,
                    }
                    getOwnerName(params).then((res)=>{
                        if(res.success){
                            this.form.ownerlist = res.result
                        }else{
                            this.$message.warning(res.message, 6)
                        }
                    })
            },
        },
        
    }
</script>

<style lang="less" scoped>
    .temporaryRecord{
        width: 100%;
        padding: 0 10px 10px 10px;
        font-style: Microsoft YaHei;
        background: #ffffff;
        box-sizing: border-box;
        .top_operation{
            margin-bottom: 10px;
            overflow: hidden;
            .every_operation{
                float: left;
                margin-top: 10px;
                margin-right: 20px;
                span{
                    display: inline-block;
                    width: 85px;
                }
            }
            .button_div{
                float: left;
                margin-top: 10px;
            }
        }
        .select_number{
            width: 100%;
            height: 36px;
            padding-left: 20px;
            margin-bottom: 10px;
            box-sizing: border-box;
            background: rgba(57, 72, 103, .22);
            line-height: 36px;
            .number_span{
                color: #ffffff;
                margin-right: 30px;
                b{
                    color: #394867;
                    margin: 0 15px;
                }
            }
            .clear_span{
                cursor: pointer;
                color: #394867;
            }
        }
        .add_btn{
            margin-bottom: 10px;
        }
        .data_source_list{
            h3{
                font-weight: bold;
            }
            .data_pagination{
                width: 100%;
                height: 32px;
                margin: 20px 0 10px 0;
            }
        }
    }
    .importModal{
        &-content{
            display: flex;
            align-items: center;
            justify-content: space-between;
            // background: red;
        }
    }
    .isResultModal{
        &-content{
            // background: red;
            .topContent{
                display: flex;
                flex-direction: column;
                justify-content: center;
                align-items: center;
                p{
                    margin: 0;
                }
                .title{
                    font-size: 20px;
                    font-weight: bold;
                    display: flex;
                    align-items: center;
                    .icon{
                        color:#f73729;
                        margin-right: 10px;
                        font-size:20px;
                    }
                }
                .desc{
                    margin-bottom: 20px;
                }
            }
        }
    }
</style>